<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>字典列表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../../lib/layui-v2.5.5/css/layui.css" media="all">
    <link rel="stylesheet" href="../../css/public.css" media="all">
    <style>
        /*文件夹图标*/
        /** 未展开 */
        .treeTable-icon .layui-icon-layer:before { content: "\e638"; }
        /** 展开 */
        .treeTable-icon.open .layui-icon-layer:before { content: "\e638"; }
        /*文件图标*/
        .treeTable-icon .layui-icon-file:before { content: "\e621"; }
        /*箭头图标*/
        /** 未展开 */
        .treeTable-icon .layui-icon-triangle-d:before { content: "\e623"; }
        /** 展开 */
        .treeTable-icon.open .layui-icon-triangle-d:before { content: "\e625"; }
    </style>
</head>
<body>
<div class="layuimini-container">
    <div class="layuimini-main">
        <fieldset class="table-search-fieldset">
            <legend>搜索信息</legend>
            <div style="margin: 10px 10px 10px 10px">
                <form class="layui-form layui-form-pane" action="">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">名称</label>
                            <div class="layui-input-inline">
                                <input type="text" name="name" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <button type="submit" class="layui-btn layui-btn-primary" lay-submit
                                    lay-filter="data-search-btn"><i class="layui-icon"></i> 定 位
                            </button>
                        </div>
                    </div>
                </form>
            </div>
        </fieldset>
        <script type="text/html" id="myToolbarElem">
            <div class="layui-btn-container">
                <button class="layui-btn layui-btn-sm data-add-btn" lay-event="add">新增字典</button>
                <button class="layui-btn layui-btn-sm" lay-event="expand" id="btn-expand">全部展开</button>
                <button class="layui-btn layui-btn-sm layui-btn-warm" lay-event="fold" id="btn-fold">全部折叠</button>
            </div>
        </script>
        <table class="layui-hide" id="myTableElem" lay-filter="myTableFilter"></table>
        <script type="text/html" id="myTableBarElem">
            <a class="layui-btn layui-btn-xs data-count-edit" lay-event="edit">编辑</a>
            <a class="layui-btn layui-btn-xs data-count-edit" lay-event="delete">删除</a>
        </script>
    </div>
</div>
<script src="../../lib/layui-v2.5.5/layui.js" charset="utf-8"></script>
<script src="../../js/lay-config.js?v=1.0.4" charset="utf-8"></script>
<script src="../../js/layutil.js" charset="utf-8"></script>
<!--<script src="../../lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>-->
<!--<script src="../../lib/jq-module/paigusu.min.js" charset="utf-8"></script>-->
<script>
    var selected = [];
    var checkList = [];//全部
    var checked = [];//编辑
    //treetable需要使用ajax去请求完数据再加载
    layui.use(['form', 'table', 'treetable', 'layer'], function () {
        var $ = layui.jquery,
            form = layui.form,
            table = layui.table,
            treetable = layui.treetable,
            layer = layui.layer;
        //判断字典
        //查询全部字典表，判断父级字典得名称
        var pdictname = function (d) {
            for (var o =0;o<checkList.length;o++) {
                if(d.pid==-1){
                    return "<span>顶级</span>"
                }
                if (d.pid == checkList[o]["id"]) {
                    return "<span>" + checkList[o]["name"]+"</span>"
                }
            }
        };
        function reload() {
            var url = '/myerp/dict/treetable';
            layutil.get(url,{},function (res) {
                console.log("res",res);
                checkList = res.data;
                var dictData = res.data;
                // 渲染表格
                layer.load(2);
                treetable.render({
                    tree: {
                        arrowType: 'arrow2',   // 自定义箭头风格
                        getIcon: function(d) {  // 自定义图标
                            // d是当前行的数据
                            if (d.haveChild) {  // 判断是否有子集
                                return '<i class="ew-tree-icon ew-tree-icon-folder"></i>';
                            } else {
                                return '<i class="ew-tree-icon ew-tree-icon-file"></i>';
                            }
                        }
                    },
                    toolbar: '#myToolbarElem',
                    treeColIndex: 1,
                    treeSpid: -1,
                    treeIdName: 'id',
                    treePidName: 'pid',
                    elem: '#myTableElem',
                    data: dictData,
                    page: false,
                    cols: [[
                        {type: 'numbers'},
                        {field: 'tips', width: 200, align: 'left', title: '字典备注'},
                        {field: 'name', width: 200, title: '字典名称'},
                        {field: 'code', width: 120, title: '字典值'},
                        {field: 'num', width: 120, align: 'center', title: '排序号'},
                        {field: 'pid', width: 200, align: 'center', title: '父级字典', templet:pdictname},
                        {title: '操作', minWidth: 150, templet: '#myTableBarElem', fixed: "right"}
                    ]],
                    done: function (res) {
                        console.log("res",res);
                        if(res.code == 401) window.location = '/page/login-1.html';
                        layer.closeAll('loading');
                    }
                });
            });
        }
        reload();

        // 监听搜索操作
        form.on('submit(data-search-btn)', function (data) {
            //执行搜索重载
            // table.reload('currentTableId', {
            //     page: {
            //         curr: 1
            //     }
            //     , where: data.field
            // }, 'data');
            //定位
            return false;
        });
        table.on('toolbar(myTableFilter)', function (obj) {
            var data = obj.data;
            if (obj.event === 'add') {
                layutil.iframe('新增字典','/page/sys_dict/dict-add.html',null,null,function () {
                    reload();
                });
            } else if(obj.event === 'expand') {
                treetable.expandAll('#currentTableId');
            } else if(obj.event === 'fold') {
                treetable.foldAll('#currentTableId');
            }
        });
        table.on('tool(myTableFilter)', function (obj) {
            var data = obj.data;
            if (obj.event === 'edit'){
                if(data.pid == "-1") {
                    layutil.tips("顶级字典不能编辑！");
                    return false;
                }
                layutil.iframe('编辑字典','/page/sys_dict/dict-edit.html',data,null,function () {
                    reload();
                });
            } else if (obj.event === 'delete') {
                if (data.pid == "-1") {
                    layutil.tips("顶级字典不能删除！");
                    return false;
                }
                var str = "确定删除字典信息？";
                layutil.confirm(str, function () {
                    console.log("data", data);
                    console.log("checkList", checkList);
                    var hasCh = hasChildren(data.id, checkList);
                    if (hasCh) {
                        layutil.tips("父级字典不能删除！");
                        return false;
                    }
                    layutil.postForm("/myerp/dict/del", {id: data.id}, function (res) {
                        if (res.code == '0') {
                            layutil.success("删除成功！", 1, function () {
                                reload();
                            });
                            return false;
                        }
                        layutil.fail("删除失败！");
                    });
                });
            }
        });

    });
    //判断是否有子集
    function hasChildren(dictId, arr) {
        for (var i = 0; i < arr.length; i++) {
            if (arr[i].pid == dictId) {
                return true;
            }
        }
        return false;
    }
</script>
<script>

</script>

</body>
</html>